<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>C-文字处理</title>
    <style>

        .demo{
            background: #f2f2f2;
            margin-bottom: 10px;
            text-align:justify;
            /*text-justify:auto;*/
            /*text-justify: inter-ideograph;*/
            /*text-justify: inter-word;*/
            text-justify: inter-cluster;
        }
        .demo-1{
            background: #a2a2a2;
            text-align:justify;
            /*text-justify:auto;*/
            /*text-justify: inter-ideograph;*/
            text-justify: inter-word;
            margin-bottom: 20px;
        }

        .demo-2{
            width: 100px;
            height:30px;
            overflow: hidden;
            white-space: nowrap;
            text-overflow:ellipsis ;
        }
        .demo-3 {
            text-shadow: 5px 5px 5px red;
        }

    </style>
</head>
<body>

<div class="demo">
    To a large degree，
    the measure of our peace of mind
    is determined by how much we are
    able to live in the present moment．
</div>

<div class="demo-1">
    轻轻的我走了，
    正如我轻轻的来；
    我轻轻的招手，
    作别西天的云彩。
    那河畔的金柳，
    是夕阳中的新娘；
    波光里的艳影，
    在我的心头荡漾。
    软泥上的青荇，
    油油的在水底招摇；
    在康河的柔波里，
    我甘心做一条水草！
</div>

<div class="demo-2">
    轻轻的我走了，正如我轻轻的来；
    我轻轻的招手，
    作别西天的云彩。
    那河畔的金柳，
    是夕阳中的新娘；
    波光里的艳影，
    在我的心头荡漾。
    软泥上的青荇，
    油油的在水底招摇；
    在康河的柔波里，
    我甘心做一条水草！
</div>

<div class="demo-3">
    轻轻的我走了，正如我轻轻的来；
</div>
</body>
</html>